//
//  DatePickerPageView.swift
//  SwiftUIDemo
//
//  Created by zhouzuosong on 2020/8/19.
//  Copyright © 2020 Kael. All rights reserved.
//

import SwiftUI

@available(iOS 14.0, *)
struct DatePickerPageView: View {
    
    @State var needSeitch = true
    private let kind: String = "UserWidget"
    
    private let sharedDefaults = UserDefaults(suiteName: "group.widget.swiftui.demo")

    var body: some View {
        ScrollView(content: {
            VStack {
                Text("DatePicker")
                HStack {
                    Spacer()
                    Image(systemName: "moon.circle")
                    Spacer()
                    Circle().frame(width: 60, height: 60.0)
                    Spacer()
                    Image(systemName: "moon.circle.fill")
                    Spacer()
                }
                .foregroundColor(Color.yellow)
                
                Button(action: {
                    self.needSeitch = !self.needSeitch
                }, label: {
                    Text("Switch Style")
                })
                
                if self.needSeitch {
                    ClassicDatePickerViewList()
                }else{
                    FormDatePickerView()
                }
                Form {
                    Section(header: Text("DatePicker")
                                .font(.largeTitle).padding())
                        {

                        if self.needSeitch {
                            ClassicDatePickerViewList()
                        }else{
                            FormDatePickerView()
                        }

                    }

                }
                
            }
        })
    }
}

struct ClassicDatePickerViewList: View{

    @State private var nextFullMoonDate = Date()

    let mainColor = Color("AccentColorDark")
    
    var body: some View {
        VStack {
            DatePicker("日期选择器标题", selection: $nextFullMoonDate,                       displayedComponents: .date)
                .padding()
                .background(Color.gray)
            
            VStack {
                Text("自定义日期选择器标题")
                DatePicker("", selection: $nextFullMoonDate,                       displayedComponents: .date)
                    .padding()
                    .background(Color.gray)
            }
            VStack {
                Text("自定义日期选择器标题")
                DatePicker("", selection: $nextFullMoonDate,                       displayedComponents: .date)
                    .padding()
                    .background(Color.gray)
                    .labelsHidden()
            }
            
            VStack {
                Text("自定义日期选择器标题")
                DatePicker("", selection: $nextFullMoonDate,                       displayedComponents: [.date , .hourAndMinute])
                    .padding()
                    .background(Color.gray)
                    .labelsHidden()
            }
            
            DatePicker("DatePicker Collapsed (Default)",
                       selection: $nextFullMoonDate,
                       displayedComponents: .date)
                .padding(.horizontal, 28)
                .background(RoundedRectangle(cornerRadius: 10).foregroundColor(.pink))
                .padding(.horizontal)
                .foregroundColor(.white)
                .labelsHidden()

            
            Text("Notice the indent of the picker.")
                .padding().frame(maxWidth: .infinity)
                .background(Color.green)
            
        }
        .foregroundColor(.white)
    }
}

struct FormDatePickerView: View {

    @State private var dateInForm = Date()
    
    var body: some View{
        VStack{
            Form {
                Section(header: Text("DatePicker")
                            .font(.largeTitle).padding())
                    {
                    Text("Used In Forms")
                        .font(.title).foregroundColor(.gray)
                        .padding()
                    DatePicker("DatePicker Collapsed (Default)",
                               selection: $dateInForm,
                               displayedComponents: .date)
                    DatePicker("DatePicker Expanded (Selected)",
                               selection: $dateInForm,
                               displayedComponents: .date)
                    
                
                }
                
            }
        }
    }
}

struct DatePickerPageView_Previews: PreviewProvider {
    static var previews: some View {
        DatePickerPageView()
    }
}
